<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>地震局培训平台</title>
		<!--<link rel="stylesheet" href="bootstrap/css/bootstrap.css" />-->
		<link rel="stylesheet" href="style/main.css" />
		<link rel="stylesheet" href="style/details.css" />
	</head>

	<body>
		<div id="info">
			<div class="info">
				<div class="newsbox">
					<!--消息滚动-->
					<div class="news nowrap">消息：欢迎加入地震应急志愿者培训平台，您是第123456位访问用户。</div>
				</div>
				<div class="infobox">
					<div class="name nowrap">zhangming</div>
					<div class="info_id nowrap">N.8784547</div>
					<div class="sign_out">退出</div>
				</div>
				<div class="leave_m">互动留言</div>
			</div>
		</div>
		<div id="show">
			<nav id="nav">
				<div class="top">
					<div class="logo"></div>
					<div class="seachbox">
						<input type="text" id="search" value="在线课堂搜索" />
						<div class="weibo codeIcon">
							<div class="first">
								<img src="image/weiboCode.png" />
							</div>
						</div>
						<div class="weixin codeIcon">
							<div class="first">
								<img src="image/weixinCode.png" />
							</div>
						</div>
					</div>
				</div>
				<div class="border">
					<ul class="nav">
						<li data-url="index">首页</li>
						<li data-url="news" class="in">新闻资讯</li>
						<!--<li data-url="story">志愿故事</li>-->
						<li class="team">志愿品牌
							<div class="first">
								<div data-url="story">志愿故事</div>
								<div data-url="team">志愿团体</div>
								<div data-url="star">志愿之星</div>
							</div>
						</li>
						<!--<li data-url="project">志愿项目</li>
						<li data-url="star">志愿之星</li>-->
						<li data-url="train">培训平台</li>
						<li data-url="policy">志愿政策</li>
					</ul>
				</div>
			</nav>

			<div id="content">

				<div class="left">
					<div id="position">
						您所在的位置：首页>新闻资讯><span>正文</span>
					</div>
					<div class="articlebox" id="main_articl">
						<div class="title"></div>
						<div class="info">
							<div>发布时间：<span class="time createDate">2018-04-03 11:27:27</span></div>
							<div>信息来源：<span class="source modelName">北京市地震局</span></div>
						</div>
						<div class="border"></div>
						<img class="img imageUrl"  src="" />
						<p class="text mycontent"></p>
						<div class="share">分享到：
							<div class="qq"></div>
							<div class="weibo2"></div>
							<div class="weixin2"></div>
						</div>
					</div>
					<div class="commentbox">
						<div class="title">网友评论</div>
						<div class="infobox">
							<div class="numbox2 numbox1">
								<span class="num">10</span>条评论
							</div>
							<div class="numbox2">
								<span class="num">25</span>人参与
							</div>
						</div>
						<textarea class="textarea" placeholder="来说两句吧..."></textarea>
						<div class="sendbtn"></div>
						<div class="comment">
							<div class="box">
								<div class="head"></div>
								<div class="nikename">没说要在乎你V</div>
								<div class="time">2小时前</div>
								<div class="text">爱心接力温暖人间，为家乡点赞。[赞][赞][赞][给力][给力][给力]</div>
							</div>
							<div class="box">
								<div class="head"></div>
								<div class="nikename">没说要在乎你没说要在乎你没说要在乎你没说要在乎你没说要在乎你没说要在乎你没说要在乎你没说要在乎你没说要在乎你没说要在乎你没说要在乎你没说要在乎你</div>
								<div class="time">2小时前</div>
								<div class="text">爱心接力温暖人间，为家乡点赞。爱心接力温暖人间，为家乡点赞。爱心接力温暖人间，为家乡点赞。爱心接力温暖人间，为家乡点赞。爱心接力温暖人间，为家乡点赞。爱心接力温暖人间，为家乡点赞。[赞][赞][赞][给力][给力][给力]</div>
							</div>
							<div class="box">
								<div class="head"></div>
								<div class="nikename">没说要在乎你V</div>
								<div class="time">2小时前</div>
								<div class="text">爱心接力温暖人间，为家乡点赞。爱心接力温暖人间，为家乡点赞。[赞][赞][赞][给力][给力][给力]</div>
							</div>
						</div>
					</div>
				</div>
				<div class="right">
					<div class="border"></div>
					<div class="articlebox2">
						<div class="title"></div>
						<ul class="article">
							<li><span class="text">河北省抗震救灾指挥部办公室推动做好全省地震应急工作检查</span></li>
							<li><span class="text">重庆市地震局专家赴荣昌区检查盘龙台标准化试点改造施工情况</span></li>
							<li><span class="text">福建省晋江市地震办开展公民道德建设宣传月活动</span></li>
						</ul>
					</div>
					<div class="nextbox">
						<div class="title">下一篇</div>
						<div class="text">云南省昭通市召开2018年度防震减灾工作会议</div>
					</div>
				</div>
			</div>

			<div id="bottom">
				<ul class="border">
					<li>相关协作单位：</li>
					<li>中国红十字会</li>
					<li>中科院心理所</li>
					<li>中国地震信息网</li>
					<li>中国地震科普网</li>
					<li>北京市地震局科普网 </li>
					<li>科普网</li>
				</ul>
				<div class="bottom">
					<ul class="one">
						<li>设为首页</li>
						<li>交换链接</li>
						<li>关于我们</li>
						<li>联系我们</li>
						<li>常见问题</li>
						<li>心理教室</li>
						<li>党团建设</li>
					</ul>
					<ul class="two">
						<li>主办：北京市地震局</li>
						<li>版权所有 京ICP备08988239</li>
						<li>技术支持：中宣助力传媒</li>
					</ul>
				</div>
			</div>
			<script type="text/javascript" src="script/jquery.min.js"></script>
			<script type="text/javascript" src="script/ishoock.tools.js"></script>
			<script type="text/javascript" src="script/main.js"></script>
			<script type="text/javascript" src="script/common.js"></script>
			<script>
				var id, policyId;
				var URL = "http://101.201.113.151:9230/";
				$(function() {
					
					//根据id 显示标题和正文内容
					var turl = decodeURI(window.location.href);
				    var Id = getUrlParam("id", turl);
					$.ajax({
						type:"get",
						url:host + "news/getNewsByid/"+Id,
						async:true,
						dataType:"json",
						success:function(data){
							console.log(data)
							for(var m in data){
								$('#main_articl .'+m).text(data[m])
							}
							$('.imageUrl').attr('src',data.imageUrl)
							$('#main_articl .mycontent').html(data.content)
						},
					})
					
							
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					//id为1，是新闻资讯页面，2是志愿故事，3是志愿之星，4为志愿政策
					id = location.getQuery("id");
					if(id == 2) {
						$(".commentbox").in();
						$("#nav .nav>li").removeIn();
						$("#nav .nav>li").eq(2).in();
						$("#position").html("您所在的位置：首页&gt;志愿故事&gt;<span>正文</span>");
					} else if(id == 3) {
						$(".commentbox").in();
						$("#nav .nav>li").removeIn();
						$("#nav .nav>li").eq(2).in();
						$("#position").html("您所在的位置：首页&gt;志愿之星&gt;<span>正文</span>");
					} else if(id == 4) {
						$(".commentbox").in();
						$("#nav .nav>li").removeIn();
						$("#nav .nav>li").eq(4).in();
						$("#position").html("您所在的位置：首页&gt;志愿政策&gt;<span>正文</span>");
						policyId = location.getQuery("policyId");
						URL2=URL + "/volunteerPolicy/getVolunteerPolicyById/" + policyId;
					}
					GetDetails();
					UpdataInfo();
				});
				
				//获取文章详情和评论列表
				function GetDetails() {
					$.get(URL2, {
						id: policyId
					}, function(data) {
						console.log(data);
						$(".articlebox .title").html(data.title);
						$(".info .time").html(data.createDate);
						//缺少来源和图片不对
						//					$(".articlebox .img").attr("src",URL+data.imageUrl);
						$(".articlebox .text").html(data.content);
					});
				}
				//上传评论
//				function UpdataInfo() {
//					$.get(URL+"/volunteerPolicy/addPolicyCommon", {
//						policyCommon : policyId
//					}, function(data) {
//						console.log(data);
//						
//					});
//				}
			</script>
	</body>

</html>